<template>
  <div class="app-container">
    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">

      <el-tab-pane label="模型信息" name="smodel">
        <el-descriptions class="margin-top" :column="2" size="medium" border>
          <el-descriptions-item>
            <template slot="label">
              模型名称
            </template>
            {{smodel.retData.name}}
          </el-descriptions-item>

          <el-descriptions-item>
            <template slot="label">
              流程关键字
            </template>
             {{smodel.retData.key}}
          </el-descriptions-item>

          <el-descriptions-item>
            <template slot="label">
              应用分类
            </template>
             {{smodel.retData.categoryName}}
          </el-descriptions-item>

          <el-descriptions-item>
            <template slot="label">
              提交次数
            </template>
             {{smodel.retData.vsCount}}
          </el-descriptions-item>

          <el-descriptions-item>
            <template slot="label">
              最新修改版本
            </template>
             {{smodel.retData.lastUpdVersion}}
          </el-descriptions-item>

          <el-descriptions-item>
            <template slot="label">
              最新修改时间
            </template>
             {{smodel.retData.lastUpdTime}}
          </el-descriptions-item>

          <el-descriptions-item>
            <template slot="label">
              最新修改人
            </template>
             {{smodel.retData.lastUpdBy}}
          </el-descriptions-item>


          <el-descriptions-item>
            <template slot="label">
              <i class="el-icon-tickets"></i>
              备注
            </template>
             {{smodel.retData.des}}
          </el-descriptions-item>


        </el-descriptions>
      </el-tab-pane>


      <el-tab-pane label="模型版本" name="smodelVersion">模型版本</el-tab-pane>
      <el-tab-pane label="模型日志" name="log">模型日志</el-tab-pane>
      <el-tab-pane label="流程绘制" name="drow">流程绘制</el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
  import Treeselect from "@riophae/vue-treeselect";
  import "@riophae/vue-treeselect/dist/vue-treeselect.css";
  import IconSelect from "@/components/IconSelect";
  import {
    findSModelById
  } from "@/api/flowDesign/sModel";

  import {
    listImages,
    pageVersion
  } from "@/api/flowDesign/sModelVersion";

  export default {
    name: "Menu",
    components: {
      Treeselect,
      IconSelect
    },
    data() {
      return {
        activeName: 'smodel',
        smodel: {
          queryId: undefined,
          retData: {}
        },
        smodelVersion: {
          total: 0,
          query: {
            pageNum: 1,
            pageSize: 10,
            domain: {}
          },
          dataList: []
        },
        smodelLogOne: {},
        smodelLogTwo: {}
      };
    },
    created() {
      //获取到参数
      let modelId = this.$route.query.smodelId;
      this.smodel.queryId = modelId;
      this.smodelVersion.query.domain.modelId = modelId;
      console.log("路由进来的模型ID：",modelId)
      //默认加载
      this.getSModelData();
    },

    methods: {
      //标签点击
      handleClick(tab, event) {
        console.log(tab, event);
      },
      //获取到自定义模型
      getSModelData() {
        console.log("模型id：{}",this.smodel.queryId)
        findSModelById(this.smodel.queryId).then(res => {
          this.smodel.retData = res.data;
          console.log(this.smodel.retData);
        })
      },
      //获取到流程版本
      findSModelVersion() {
        pageVersion(this.smodelVersion.query).then(res => {
          this.smodelVersion.dataList = res.data.records;
          this.smodelVersion.total = res.data.total;
        })
      }


    }
  };
</script>
